// /import core
// /import uicore
(function() {
	var utils = baidu.editor.utils, uiUtils = baidu.editor.ui.uiUtils, UIBase = baidu.editor.ui.UIBase;

	var TablePicker = baidu.editor.ui.TablePicker = function(options) {
		this.initOptions(options);
		this.initTablePicker();
	};
	TablePicker.prototype = {
		defaultNumRows : 10,
		defaultNumCols : 10,
		maxNumRows : 20,
		maxNumCols : 20,
		numRows : 10,
		numCols : 10,
		lengthOfCellSide : 22,
		initTablePicker : function() {
			this.initUIBase();
		},
		getHtmlTpl : function() {
			return '<div id="##" class="edui-tablepicker %%">'
					+ '<div class="edui-tablepicker-body">'
					+ '<div class="edui-infoarea">'
					+ '<span id="##_label" class="edui-label"></span>'
					+ '<span class="edui-clickable" onclick="$$._onMore();">更多</span>'
					+ '</div>' + '<div class="edui-pickarea"'
					+ ' onmousemove="$$._onMouseMove(event, this);"'
					+ ' onmouseover="$$._onMouseOver(event, this);"'
					+ ' onmouseout="$$._onMouseOut(event, this);"'
					+ ' onclick="$$._onClick(event, this);"' + '>'
					+ '<div id="##_overlay" class="edui-overlay"></div>'
					+ '</div>' + '</div>' + '</div>';
		},
		_UIBase_render : UIBase.prototype.render,
		render : function(holder) {
			this._UIBase_render(holder);
			this.getDom('label').innerHTML = '0列 x 0行';
		},
		_track : function(numCols, numRows) {
			var style = this.getDom('overlay').style;
			var sideLen = this.lengthOfCellSide;
			style.width = numCols * sideLen + 'px';
			style.height = numRows * sideLen + 'px';
			var label = this.getDom('label');
			label.innerHTML = numCols + '列 x ' + numRows + '行';
			this.numCols = numCols;
			this.numRows = numRows;
		},
		_onMouseOver : function(evt, el) {
			var rel = evt.relatedTarget || evt.fromElement;
			if (!uiUtils.contains(el, rel) && el !== rel) {
				this.getDom('label').innerHTML = '0列 x 0行';
				this.getDom('overlay').style.visibility = '';
			}
		},
		_onMouseOut : function(evt, el) {
			var rel = evt.relatedTarget || evt.toElement;
			if (!uiUtils.contains(el, rel) && el !== rel) {
				this.getDom('label').innerHTML = '0列 x 0行';
				this.getDom('overlay').style.visibility = 'hidden';
			}
		},
		_onMouseMove : function(evt, el) {
			var style = this.getDom('overlay').style;
			var offset = uiUtils.getEventOffset(evt);
			var sideLen = this.lengthOfCellSide;
			var numCols = Math.ceil(offset.left / sideLen);
			var numRows = Math.ceil(offset.top / sideLen);
			this._track(numCols, numRows);
		},
		_onClick : function() {
			this.fireEvent('picktable', this.numCols, this.numRows);
		},
		_onMore : function() {
			this.fireEvent('more');
		}
	};
	utils.inherits(TablePicker, UIBase);
})();
